<template>
  <div class="main">
    <el-table v-loading="loading" :data="dataList"
      :header-cell-style="{background:'#f6fbfb',color:'#000',height:'44px'}"
      :row-style="{height:'50px'}"
    >
      <el-table-column label="序号" type="index" width="244"></el-table-column>
      <el-table-column label="标的发布名称" prop="bidTitle" width="530"></el-table-column>
      <el-table-column label="结束时间" prop="bidBidding.endDate"></el-table-column>
      <el-table-column label="状态" prop="bidBidding.status">
        <template slot-scope="scope">
          <span v-if="scope.row.bidBidding.status === '0' && scope.row.filesList.length === 0" style="color: #FF8200;">报名成功</span>
          <span v-if="scope.row.bidBidding.status === '0' && scope.row.filesList.length > 0" style="color: #666;">{{ getValueDict(scope.row.bidBidding.status) }}</span>
          <span v-if="scope.row.bidBidding.status === '1' " style="color: #0015ff;">{{ getValueDict(scope.row.bidBidding.status) }}</span>
          <span v-if="scope.row.bidBidding.status === '2' " style="color: #999;">{{ getValueDict(scope.row.bidBidding.status) }}</span>
          <span v-if="scope.row.bidBidding.status === '3' " style="color: #1dd0b7;">{{ getValueDict(scope.row.bidBidding.status) }}</span>
        </template>
      </el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button type="text" size="mini" style="color: #1dd0b7;" @click="handelTableRow(scope.row)">
            <template v-if="scope.row.bidBidding.status === '0' && scope.row.filesList.length === 0">提交资料</template>
            <template v-if="(scope.row.bidBidding.status === '0' && scope.row.filesList.length) || scope.row.bidBidding.status === '1' || scope.row.bidBidding.status === '3'">查看</template>
            <template v-if="scope.row.bidBidding.status === '2'">--</template>
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <Pagination
      v-if="total > 0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getData"
    />
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import {listEnterprise} from '../../api/bid/enterprise'
export default {
  name: "myBidding",
  data() {
    return {
      loading:true,
      dataList:[],
      queryParams:{
        pageSize:20,
        pageNum:1
      },
      total:0,

      bidStatus:[]
    }
  },
  created() {
    this.getData()

    this.getDicts('bid_status').then(res=>{
      this.bidStatus = res.data
    })
  },
  methods: {
    getValueDict(key){
      const dicts = this.bidStatus.filter(x => x.dictValue === key.toString())
      if (dicts && dicts.length > 0 ) {
        return dicts[0].dictLabel
      }
      return ''
    },
    handelTableRow(row){
      if (row.bidBidding.status === '0' && row.filesList.length === 0) {
        this.$router.push('/enterprise/commitFile?id=' + row.id)
      }else if((row.bidBidding.status === '0' && row.filesList.length) || row.bidBidding.status === '1' || row.bidBidding.status === '3'){
        this.$router.push('/bid/detail?id=' + row.bidBidding.id)
      }else{
        return
      }
    },
    getData(){
      this.queryParams.enterpriseId = this.userId
      this.queryParams.category = 2
      listEnterprise(this.queryParams).then(res=>{
        this.dataList = res.rows
        this.total = res.total
        this.loading = false
      })
    },
  },
  computed: {
    ...mapGetters(['userId'])
  }
}
</script>

<style lang="scss" scoped>
.main{
  width: 90%;
  margin: auto;  
}

::v-deep .el-pagination{
  position: relative;
  display: flex;
  justify-content: center;
}

::v-deep .el-pager .active{
  color: #1dd0b7;
  cursor: pointer;
}
</style>
